<template>
  <div class="main" ref="remove">
    <div class="univSearchWrap">
      <div class="univSearBox">
        <div v-show="hasBack"><headerBack></headerBack></div>
        <div class="sers">
          <div class="searchLine flex-h">
            <span class="imgIcon icon_search"></span>
            <div class="flex1">
              <search
                :auto-fixed="false"
                :results="results"
                v-model="value"
                position="absolute"
                auto-scroll-to-top
                top="46px"
                @on-submit="onSubmit"
                ref="search"
              ></search>
            </div>
            <div class="clears" @click="clears">
              <span class="imgIcon" v-show="value.length > 0"></span>
            </div>
          </div>
        </div>
      </div>
      <scroller
        ref="scrollerBottom"
        :style="hasBack?'top: 95px;':'top: 46px;'"
        :on-infinite="handleReachButton"
        :noDataText="noDataText"
      >
        <div>
          <div v-show="newsDataList.length>0">
            <univBox :univData="newsDataList"></univBox>
          </div>
          <div v-show="newsDataList.length==0">
            <div class="noDataImage">
              <img src="~/static/nothing/empty_sousuojieguo.png" alt />
              <div  class="describe">{{desc1}}</div>
              <div class="describe">{{desc2}}</div>
            </div>
          </div>

          <div style="width: 100%;height: 0.92rem;"></div>
        </div>
      </scroller>
    </div>
  </div>
</template>
<script>
import { academyServicepageList } from "~/api/colleges";
import univBox from "./components/univBox";
import headerBack from "~/components/headerBack";
import ls from "store2";
import { Search } from "vux";
import { format } from "~/plugins/filter";
export default {
  components: {
    Search,
    univBox,
    headerBack
  },

  data() {
    return {
      desc1:'',
      desc2:'',
      noDataText: "没有更多学校了~",
      searchs: "init",
      results: [],
      value: "",
      univsData: [],
      newsDataList: [],
      hasBack: true,
      currentPage: 1,
      shows: true,
      dailiData: []
    };
  },
  watch: {},
  created() {
    if(sessionStorage.getItem('outer')=='smallProgram'){
        this.hasBack = false
    }
    let serData = JSON.parse(sessionStorage.getItem("serListDlData"));
    if (serData && ls.get("userArea")) {
      this.value = sessionStorage.getItem("sercher");
      this.totalpages = sessionStorage.getItem("serTotalPage") * 1;
      this.newsDataList = serData;
      this.currentPage = sessionStorage.getItem("serCount") * 1;
    }
  },
  mounted: function() {
     this.$visit("AcademySearch")
  },
  destroyed() {
    // this.commonJs.destr()
  },
  watch: {},
  beforeRouteEnter(to, from, next) {
    next(vm => {
      if (vm && vm.$refs.scrollerBottom) {
        //通过vm实例访问this
        setTimeout(function() {
          vm.$refs.scrollerBottom.scrollTo(
            0,
            vm.$store.state.recruitScrollY2,
            false
          );
        }, 0); //同步转异步操作
      }
    });
  },
  beforeRouteLeave(to, from, next) {
    var _this = this;
    if (ls.get("tokensyxk") && ls.get("yxkData")) {
      let scrolly = this.$refs.scrollerBottom.getPosition().top;
      this.$store.commit("changeRecruitScrollY2", scrolly);
    }
    sessionStorage.setItem("sercher", this.value);
    sessionStorage.setItem("serListDlData", JSON.stringify(this.newsDataList));
    sessionStorage.setItem("serCount", this.currentPage);
    sessionStorage.setItem("serTotalPage", this.totalpages);
    ls.set("preUrl", "search");
    next();
  },
  methods: {
    handleReachButton(done) {
      if (this.currentPage < this.totalpages) {
        this.currentPage = this.currentPage + 1;
        academyServicepageList({
          pageNo: this.currentPage,
          pageSize: 10,
          academyName: this.value,
          province: ls.get("userArea"),
          fromUserId: ls.get("yxkData").userId,
          year: 2019
        }).then(res => {
          if (res.code == "0") {
            let newArr = res.data.list;
            this.newsDataList = this.newsDataList.concat(newArr);
            this.totalpages = res.data.pages;
            done();
          }
        });
      } else {
        this.noDataText = "";
        done(true);
        return;
      }
    },
    academyServicepageList() {
      this.$loading('open');
      let userids = ls.get("yxkData").userId;
      let prov = ls.get("userArea");
      academyServicepageList({
        pageNo: 1,
        pageSize: 10,
        academyName: this.value,
        province: prov,
        fromUserId: userids,
        year: 2019
      })
        .then(res => {
          if (res.code == "0") {
            if (res.data.total === 0) {
              this.noDataText = ""
              this.newsDataList = []
              this.desc1='升学小助手正在勤恳为您搜寻资料完善信息～'
              this.desc2='请对小助手保持信心'
            } else {
              this.totalpages = res.data.pages;
              this.newsDataList = res.data.list;
            }
          }
          this.$hideLoading();
        })
        .catch(error => {
          this.$hideLoading();
        });
    },
    onSubmit() {
      this.currentPage = 1;
      this.academyServicepageList();
    },

    clears() {
      this.value = "";
    },

    goto(routerName, queryData) {
      this.$router.replace({
        path: routerName,
        query: {
          type: queryData
        }
      });
    }
  },
  beforeDestroy() {}
};
</script>

<style lang="less">
.univSearchWrap {
  width: 7.5rem;
  min-height: 100vh;
  background: #fff;

  .univSearBox {
    width: 7.5rem;

    box-sizing: border-box;
    height: auto;

    .sers {
      width: 100%;
      height: auto;
      padding: 0 0.3rem;
      box-sizing: border-box;
    }

    .searchLine {
      width: 100%;
      height: 46px;
      padding-right: 0.3rem;
      box-sizing: border-box;
      border-bottom: 1px solid rgba(238, 238, 238, 1);
      padding-left: 0.08rem;

      .weui-search-bar {
        background-color: none;
        padding: 0;
      }

      .weui-search-bar:before {
        border: none;
        height: 0;
      }

      .weui-search-bar:after {
        border: none;
        height: 0;
      }

      .weui-search-bar__box {
        padding-left: 0.2rem;
      }

      .weui-search-bar__form:after {
        border: none;
        border-radius: 0;
      }

      .weui-search-bar.weui-search-bar_focusing .weui-search-bar__cancel-btn {
        display: none !important;
      }

      .weui-search-bar__box .weui-icon-clear {
        display: none !important;
      }

      .weui-icon-search:before {
        display: none !important;
      }

      .imgIcon {
        display: inline-block;
        width: 0.32rem;
        height: 0.32rem;
      }
      .icon_search {
        background: url('~/static/sprite/other_sprites.png') 0.42rem -0.65rem;
        background-size: 4.68rem 4.08rem;
      }
      .clears {
        width: 0.6rem;
        height: 46px;
        line-height: 46px;
        span {
          background: url('~/static/sprite/other_sprites.png') 0.42rem -0.1rem;
          background-size: 4.68rem 4.08rem;
        }
      }

    }
  }

  .noDataImage {
    text-align: center;
    padding-top: 2.4rem;
    img {
      width: 2.4rem;
      height: 2.4rem;
      margin-bottom: 0.24rem;
    }
    .describe {
      width:6rem;
      margin: 0 auto;
      color: #999;
      font-size: 0.28rem;
      line-height: 0.4rem;
    }
  }
}
</style>
